<template>
	<view style="padding: 20rpx 40rpx;">
		<view
			style="background-color: #2D80E3;padding: 40rpx;height: 200rpx;display: flex;flex-direction: column;justify-content: space-between;border-radius: 10rpx;box-shadow: 1rpx 1rpx 20rpx #2D80E3">
			<text style="font-size: 26rpx;color: #fff;">可提现金额（元）</text>
			<view style="display: flex;flex-direction: row; align-items: baseline;">
				<text style="font-size: 22rpx;color: #fff;">￥</text>
				<text style="font-size: 38rpx;color: #fff;font-weight: bold;">{{user.balance}}</text>
			</view>
		</view>
		<view style="margin: 40rpx 0;">
			<text>提现金额</text>
		</view>
		<view
			style="display: flex;flex-direction: row; align-items: center;justify-content: space-between;padding-bottom: 10rpx;width: 100%;border-bottom: 2rpx solid #f5f5f5;">
			<u--form :model="form" ref="uForm" :border-bottom="false" style="flex: 1;width: 100%;"
				:error-type="errorType">
				<u-form-item prop="amount" left-icon="rmb"
					:left-icon-style="{fontSize: '24rpx', marginRight: '20rpx', color: '#333'}">
					<u-input type="number" style="width: 100%;" border="none" v-model="form.amount"
						placeholder="请输入提现金额" :clearable="true" />
					<view @click="all()" slot="right" style="font-size: 24rpx;color: #333;">全部</view>
				</u-form-item>
			</u--form>
		</view>

		<view style="margin: 40rpx 0;">
			<text>收款银行卡</text>
		</view>
		<navigator url="/pages/creditcard/cashier/selectDebitCard" class="d">
			<view class="l">
				<image :src="defultBank.bank_logo" mode="widthFix"></image>
				<view class="bankInfo">
					<view class="h3">
						{{defultBank.name?defultBank.name:''}}
					</view>
					<view class="p" v-if="defultBank.full_card_number">
						**** **** ****
						{{defultBank.full_card_number.substring(defultBank.full_card_number.length-4)}}
					</view>
				</view>
			</view>
			<view class="r">
				<u-icon name="arrow-right"></u-icon>
			</view>
		</navigator>
		<!-- <view style="padding-bottom: 30rpx;">
			<u-radio-group v-model="radioValue" @change="radioGroupChange">
				<u-radio @change="radioChange" v-for="(item, index) in radio" :key="index" :name="item.title">
					{{item.title}}
				</u-radio>
			</u-radio-group>
		</view> -->

		<view style="display: flex;flex-direction: column;margin: 20rpx auto;padding-bottom: 60rpx;">
			<text class="zy_text" style="font-size: 30rpx;">提现规则:</text>
			<view class="zy-item">
				<view class="zy-item-num">1.</view>
				<view class="zy-item-content">提现100元起提，1元的整数倍；</view>
			</view>
			<view class="zy-item">
				<view class="zy-item-num">2.</view>
				<view class="zy-item-content">提现完成后会在24小时内到账,一般在下午五六点左右统一打款</view>
			</view>
		</view>

		<u-button @click="withdrawal()" :custom-style="buttonStyle" :plain="true" :hair-line="false" shape="circle"
			hover-class="none">
			<text style="color: #fff;">立即提现</text>
		</u-button>

		<view @click="openPage('pages/center/withdrawalLog', {})"
			style="display: flex;justify-content: center;align-items: auto;width: 100%;color: #999;font-size: 24rpx;margin-top: 20rpx;">
			查看提现记录>></view>
	</view>
</template>
<script>
	import {userInfoByToken} from '@/common/http.api.js'
	import {
		bankcard
	} from '@/common/bankcard.api.js'
	import {
		withdrawal
	} from '@/common/user.api.js'
	export default {
		data() {
			return {
				errorType: ['toast', 'message'],
				form: {
					amount: '',
					type: 1
				},
				zfbSwitchVal: false,
				wxSwitchVal: false,
				rules: {
					amount: [
						// 对name字段进行必填验证
						{
							required: true,
							message: '请填写提现金额',
						},
						{
							pattern: /^[0-9]*[1-9][0-9]*$/,
							message: '提现金额必须是整数',
							trigger: ['blur']
						},
					]
				},
				buttonStyle: {
					backgroundColor: '#2D80E3',
					marginTop: "20rpx"
				},
				user: null,
				radio: [],
				radioValue: "微信",
				defultBankFlag: false,
				defultBank: {},
			}
		},
		onLoad({
			user
<<<<<<< HEAD
		}) {
			let that = this;
			
			this.user = JSON.parse(user)
			
			this.getBankList();
			
			uni.$on('updateUserInfo', function(data) {
				that.$u.api.userInfoByToken({}).then(res => {
					that.user = res
					uni.setStorageSync('user_info', JSON.stringify(res))
				})
			})
			// that.$u.api.cashType({}).then(res => {
			// 	that.radioValue = res[0].title
			// 	for(let i = 0; i < res.length; i++){
			// 		if(res[i].default == 1){
			// 			that.radioValue = res[i].title
			// 		}
			// 	}
			// 	that.radio = res
			// })
			
			uni.$on('bankInfo', (bankInfo) => {
				this.defultBank = bankInfo.addrsssid
				this.defultBankFlag = true
			})	
		},
		onReady() {
=======
		}) {
>>>>>>> yihuishenghuo
			let that = this;

			this.user = JSON.parse(user)

			this.getBankList();

			uni.$on('updateUserInfo', function(data) {
				userInfoByToken({}).then(res => {
					that.user = res
					uni.setStorageSync('user_info', JSON.stringify(res))
				})
			})

			// that.$u.api.cashType({}).then(res => {
			// 	that.radioValue = res[0].title
			// 	for(let i = 0; i < res.length; i++){
			// 		if(res[i].default == 1){
			// 			that.radioValue = res[i].title
			// 		}
			// 	}
			// 	that.radio = res
			// })

			uni.$on('bankInfo', (bankInfo) => {
				this.defultBank = bankInfo.addrsssid
				this.defultBankFlag = true
			})
		},
		onReady() {
			let that = this;
			that.$refs.uForm.setRules(this.rules);

		},
		methods: {
			getBankList() {
				bankcard({
					page: 1,
					page_size: 20,
					type: '00'
				}).then(res => {
					this.defultBank = res.list[0];
					this.defultBankFlag = true
				})
			},
			openPage(path, params = {}) {
				this.$u.route({
					url: path,
					params
				})
			},
			radioGroupChange(e) {
				if (e == "支付宝") {
					this.form.type = 2;
				} else if (e == "微信") {
					this.form.type = 1;
				}
			},
			radioChange(e) {
				if (e == "支付宝") {
					this.form.type = 2;
				} else if (e == "微信") {
					this.form.type = 1;
				}
			},
			withdrawal() {
				console.log(111111111111111)
				let that = this;
				// if (this.user.mobile) {
				this.$refs.uForm.validate().then(res => {
					uni.showLoading({
						title: '正在发起提现'
					})
					let params = {
						amount: that.form.amount,
						bankcard_id: that.defultBank.id
					}
					withdrawal(params).then(res => {
						uni.$emit('updateUserInfo', {
							msg: '刷新用户信息'
						})
						uni.hideLoading()
						that.form.amount = ''
						that.$refs.uForm.resetFields()
						that.$u.toast('已发起提现,等待到账信息');
						that.openPage('/pages/center/withdrawalLog')
					})
				}).catch(errors => {
					console.log(errors)
					uni.$u.toast(errors[0].message)
				});
				// } else {
				// 	that.$u.toast('先绑定手机号');
				// 	that.$u.route({
				// 		url: '/pages/auth/bindMobile',
				// 		params: {}
				// 	})
				// }
			},
			all() {
				this.form.amount = parseInt(this.user.balance)
			},
			copy(text) {
				let that = this;
				uni.setClipboardData({
					data: text,
					success: function() {

					}
				});
			}
		}
	}
</script>

<style lang="less">
	body {
		background-color: #fff;
	}

	.zy_text {
		color: #999;
		font-size: 28rpx;
		margin-top: 10rpx;
	}

	.zy-item {
		display: flex;
		flex-direction: row;
		margin-top: 10rpx;
	}

	.zy-item-num {
		color: #999;
		font-size: 28rpx;
		margin-right: 4rpx;
	}

	.zy-item-content {
		color: #999;
		font-size: 28rpx;
	}

	.d {
		padding: 30rpx 0;
		border-bottom: 1px solid #eee;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 30rpx;

		image {
			width: 90rpx;
			height: 90rpx;
			border-radius: 100%;
			margin-right: 15rpx;
			margin-top: -5rpx;
		}

		.l {
			display: flex;
			align-items: center;

			.h3 {
				margin-bottom: 5rpx;
				margin-top: 5rpx;
			}
		}
	}
</style>
